<!DOCTYPE html>
<html>
<head lang="zh-CN">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <title>订单详情</title>
    <link rel="stylesheet" href="../src/css/weui.css">
    <link rel="stylesheet" href="../src/css/star-rating-svg.css">
    <script src="../src/js/libs/jquery-3.0.0.min.js"></script>
    <script src="../src/js/libs/jquery.star-rating-svg.js" ></script>
    <script src="../src/js/main.js"></script>
    <style>
        body{
            font: 2rem/1em "微软雅黑";
            font-weight: 400;
        }
        /* 顶部样式 */
        .weui_cell.top{
            line-height: 3rem;
        }
        .weui_cell.top .weui_cell_hd{
            display: block;
            background: url("../src/images/icons.png") no-repeat;
            background-size: 11.92125rem 7.315rem;
            width: 2.0625rem;
            height:2.0625rem;
            background-position: 0 -3.7125rem;
            margin-left: 1.0625rem;
            margin-right: 1.46875rem;
        }

        .weui_cell.top .weui_cell_bd{
            font-size: 1.5rem;
            font-weight: 400;
        }
        /* 图文 */
        .success{
            display: block;
            font-size: .5rem;
            color: #04BE02;
            border: solid 1px #04BE02;
            border-radius: 2px;
            padding: 0.2rem 0.5rem;
            line-height: 1em;
        }
        .weui_panel_bd{
            border-top: solid 1px #cccccc;
        }
        .weui_panel_bd .weui_media_title{
            font-size: 0.9375rem;
            margin-bottom: 0.9rem;
        }
        .weui_panel_bd .weui_media_desc{
            font-size: 0.6rem;
        }
        /* 评价 */
        .evaluate{
            font-size: 0.8rem;
            color: #5d5d5d;
        }
        .evaluate .weui_cell_hd.weui_cell_primary>p,.weui_cells_title{
            line-height: 2rem;
            font-size: 1.2rem;
            color: #333333;
        }
        .detail .weui_cell_bd.weui_cell_primary>p, .detail.weui_cells .weui_cell_ft{
            font-size: 1rem;
            color: #5d5d5d;

        }
    </style>
</head>
<body>


<div class="weui_cell top">
    <div class="weui_cell_hd"></div>
    <div class="weui_cell_bd weui_cell_primary">
        <p>广州捷泰维修厂</p>
    </div>
</div>

<div class="weui_panel_bd">
    <a href="javascript:void(0);" class="weui_media_box weui_media_appmsg">
        <div class="weui_media_hd">
            <img class="weui_media_appmsg_thumb" src="" alt="">
        </div>
        <div class="weui_media_bd">
            <h4 class="weui_media_title">全速汽车车载可视倒车雷达影像系统</h4>
            <p class="weui_media_desc">汽车服务</p>
        </div>

        <div class="weui_cell_ft">
            <p class="weui_media_desc">
             0.01
            </p>
            <p class="weui_media_desc">
                -300
            </p>
            <p class="weui_media_desc">
                *2
            </p>
            <span class="success">交易成功</span>
        </div>
    </a>
    </div>

<div class="weui_cells">
    <div class="weui_cell">
        <div class="weui_cell_hd weui_cell_primary">
            <p>订单评价</p>
        </div>
        <div class="weui_cell_ft">
            <div class="my-rating"></div>
        </div>
    </div>
    <div class="weui_cell evaluate">
        <div class="weui_cell_bd weui_cell_primary">
            <p>好评如潮,好评如潮,好评如潮,好评如潮</p>
        </div>
    </div>
</div>

<div class="weui_cells_title">订单信息</div>
<div class="weui_cells detail">
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <p>订单号</p>
        </div>
        <div class="weui_cell_ft">25523494032</div>
    </div>
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <p>创建时间</p>
        </div>
        <div class="weui_cell_ft">2016-6-26 23：59</div>
    </div>
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <p>订单类型</p>
        </div>
        <div class="weui_cell_ft">商城订单</div>
    </div>
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <p>支付总额</p>
        </div>
        <div class="weui_cell_ft">1元</div>
    </div>
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <p>手续总额</p>
        </div>
        <div class="weui_cell_ft">0.01元</div>
    </div>
</div>

<div class="weui_cells_title">订单状态</div>
<div class="weui_cells detail">
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <p>支付状态</p>
        </div>
        <div class="weui_cell_ft">买家已支付，等待卖家发货</div>
    </div>
    <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
            <p>微信单号</p>
        </div>
        <div class="weui_cell_ft">31231304230211</div>
    </div>
</div>

</body>
</html>